var ui_tab;

(function($){
    function callLater(fun, obj){
        return function(event){fun.call(obj, this, event);}
    }

	ui_tab = function(obj){
		$.extend(this,ui_tab.setting,obj);
        if(!obj.id || obj.id == ""){
            this.id = "ui-tab"+Math.floor(Math.random()*Math.pow(10,10));
        }
		return this.construct();
	}
	
	ui_tab.prototype = {
		//构造函数
		construct: function(){
			this.build();
            $(this.parent).find("li").live("mouseover", callLater(this.showMenu, this))
            .live("mouseout", callLater(this.hideMenu, this))
            .live("click", callLater(this.clickItem, this));
		},
		
		//构建主菜单
		build: function(){
			var html = [];
			Array.prototype.push.call(html,
				'<div id="', this.id, '" class="', this.className,'">',
				'<span class="sprite tab_left"></span>',
				'<span class="sprite tab_right"></span>',
				'<ul class="sprite tab_content">'
			);
			for(var i=0;i<this.items.length;i++){
                html.push(this.buildItem(this.id+"_"+i, this.items[i]));
			}
			html.push('</ul><div class="clear"></div></div>');
			
			$(this.parent).html(html.join(""));
		},

        //显示菜单
        showMenu: function(el){
            var jq = $(el);
            var indexs = jq.attr("id").split("_");
            indexs.splice(0,1);
            jq.addClass("on");

            var func = this.buildSub;
            if(indexs.length == 2){
                func = this.buildTrd;
            }
            func.apply(this, indexs);
            $("#" + this.id).addClass("on").find("li.selected:not(.on)").children(":not(a)").hide();
        },

        //隐藏菜单
        hideMenu: function(el){
            var jq = $(el);
            jq.removeClass("on").children(":not(a)").hide();
            $("#" + this.id).removeClass("on").find("li.selected").children(":not(a):not(.trdtab)").show();
        },
        
        //通过索引切换菜单
        changeItem: function(indexs){
        	if(indexs.length > 0){
	        	var id = this.id + "_" + indexs.join("_");
	        	var jq = $("#" + id);
	        	if(jq.length == 0){
	        		if(indexs.length == 2){
	        			this.buildSub(indexs[0]);
	        		}
	        		if(indexs.length == 3){
	        			this.buildTrd(indexs[0],indexs[1]);
        			}
	        		jq = $("#" + id);
	        	}
        		jq.click();
        	}
        },

        //点击子项
        clickItem: function(el, event){
            var jq = $(el);
            if(!jq.hasClass("selected")){
	            if(jq.children(":not(a)").length == 0){
	                $("#" + this.id).find("li.selected").removeClass("selected");
	                jq.add(jq.parents("li")).addClass("selected");
	            }
	            var indexs = jq.attr("id").split("_");
            	indexs.splice(0,1);
            	var obj = {children: this.items};
            	for(var i=0;i<indexs.length;i++){
            		obj = obj.children[parseInt(indexs[i])];
            	}
            	if(obj && obj.callback){
            		obj.callback(obj,indexs);
            	}
            	else{
            		this.callback(obj,indexs);
            	}
            }
            event.stopPropagation();
        },
		
		//构建二级菜单
		buildSub: function(index){
            var items = this.items[index].children;
            if(!items){
                return;
            }

            var id = this.id + "_" + index;
            var jq = $("#"+id);
            var jqc = jq.children(".subtab");
            if(jqc.length == 0){
                var html = [];
			    Array.prototype.push.call(html,
				    '<div id="', id, '_sub', '" class="subtab">',
				    '<span class="sprite subtab_arrow"></span>',
                    '<div class="suboffset">',
				    '<span class="sprite subtab_left"></span>',
				    '<ul class="sprite subtab_content">'
			    );
			    for(var i=0;i<items.length;i++){
                    html.push(this.buildItem(id+"_"+i, items[i]));
			    }
			    html.push('</ul><span class="sprite subtab_right"></span></div></div>');
			    jq.append(html.join(""));
                jqc = jq.children().last();
                this.fixedSub(jqc);
            }

            jqc.show();
		},

        //构建三级菜单
        buildTrd: function(index1, index2){
            var items = this.items[index1].children[index2].children;
            if(!items){
                return;
            }

            var id = this.id + "_" + index1 + "_" + index2;
            var jq = $("#"+id);
            if(jq.length == 0){
            	this.buildSub(index1);
            	jq = $("#"+id);
            }
            var jqc = jq.children(".trdtab");
            if(jqc.length == 0){
                var html = [];
			    Array.prototype.push.call(html,
				    '<div id="', id, '_trd', '" class="trdtab">',
				    '<div class="sprite trdtab_header"></div>',
				    '<ul class="sprite trdtab_content">'
			    );
			    for(var i=0;i<items.length;i++){
                    html.push(this.buildItem(id+"_"+i, items[i]));
			    }
			    html.push('</ul><div class="sprite trdtab_footer"></div></div>');
			    jq.append(html.join(""));
                jqc = jq.children().last();
            }

            jqc.show();
            jq.addClass("on");
        },

        //构建子项
        buildItem: function(id, item){
            var html = [];
            Array.prototype.push.call(html,
				'<li id="', id, '"', (item.children ? ' class="tab_extend"' : ''), '>',
                '<a href="', (item.link ? item.link : 'javascript:void(0)'), '" hidefocus="true" title="', item.tip,'">', item.name, '</a>',
                '</li>'
			);

            return html.join("");
        },

        //定位二级菜单
        fixedSub: function(jq){
            jq = jq.children(".suboffset");
            var l = jq.offset().left;
            var w = this.getWidth(jq.find("span,li"));
            var sw = document.documentElement.offsetWidth;
            jq.width(w);

            var left = 0;
            if(w > sw){
                left = -l;
            }
            else if(l + this.__suboffset < 0){
                left = 0;
            }
            else if(l + this.__suboffset + w > sw){
                left = sw - l - w;
            }
            else{
                left = ui_tab.setting.__suboffset;
            }

            jq.css("left", left);
            jq = null;
        },

        getWidth: function(items){
            var w = 0;
            var ml,mr,jq;
            for(var i=0;i<items.length;i++){
            	jq = $(items[i]);
            	ml = parseInt(jq.css("margin-left"));
            	mr = parseInt(jq.css("margin-right"));
            	if(isNaN(ml)){
            		ml = 0;
            	}
            	if(isNaN(mr)){
            		mr = 0;
            	}
                w += jq.width() + ml + mr + 3;
            }

            return w;
        }
	}
	
	ui_tab.setting={
        __ot: {},
        __suboffset: -50,
		parent:document.body,
		className:"ui_tab"
	}
})(jQuery);